$(function () {
  var mySwiper = new Swiper(".swiper-container", {
    loop: true, // 循环模式选项

    // 如果需要前进后退按钮
    navigation: {
      nextEl: ".swiper-button-next",
      prevEl: ".swiper-button-prev",
    },
    on: {
      init: function () {
        swiperAnimateCache(this); //隐藏动画元素
        swiperAnimate(this); //初始化完成开始动画
      },
      slideChangeTransitionEnd: function () {
        swiperAnimate(this); //每个slide切换结束时也运行当前slide动画
      },
    },
  });
});
$(function () {
  let timer = 0;
  let index = 1;
  let flag = true;

  setPoint();
  copyEle();
  autoPlay();
  bindEvent();
  changeTab();

  function setPoint() {
    const num = $(".banner > .img_box > li").length;
    let str = "";
    for (var i = 0; i < num; i++) {
      str += `<li class="${i === 0 ? "active" : ""}"></li>`;
    }
    $(".banner > .point_box")
      .html(str)
      .css("width", num * 35)
      .css("marginLeft", $(".point_box").width() / -2);
  }

  function copyEle() {
    const first = $(".img_box").children().first().clone();
    const last = $(".img_box").children().last().clone();

    $(".img_box")
      .prepend(last)
      .append(first)
      .css({
        width: $(".img_box > li").length * 100 + "%",
        left: $(".img_box > li").width() * -1,
      });
  }

  function autoPlay() {
    timer = setInterval(() => {
      index++;
      $(".img_box").animate(
        { left: -index * $(".img_box > li").width() },
        500,
        moveEnd
      );
    }, 4000);
  }

  function moveEnd() {
    if (index >= $(".img_box > li").length - 1) {
      index = 1;
      $(".img_box").css("left", -index * $(".img_box > li").width());
    }
    if (index <= 0) {
      index = $(".img_box > li").length - 2;
      $(".img_box").css("left", -index * $(".img_box > li").width());
    }

    $(".point_box > li")
      .removeClass("active")
      .eq(index - 1)
      .addClass("active");

    flag = true;
  }

  function bindEvent() {
    $(".banner").on("click", ".point_box > li", function () {
      if (!flag) return;
      flag = false;
      index = $(this).index() + 1;
      $(".img_box").animate(
        { left: -index * $(".img_box > li").width() },
        500,
        moveEnd
      );
    });
  }

  function changeTab() {
    $(document).on("visibilitychange", function () {
      if (document.visibilityState === "hidden") clearInterval(timer);
      else if (document.visibilityState === "visible") autoPlay();
    });
  }
});


$(function () {
   $('.go > span').on('click' , function() {
     $('.login-box').css('display' , 'block' )
   })
   $('.out').on('click' , function() {
    $('.login-box').css('display' , 'none' )
   })
});